<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1">
    <meta content=always name=referrer>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/swiper.min.css">
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/base.css">
    <script src="__STATIC__/js/jquery-1.8.2.js"></script>
    <script src="__STATIC__/js/swiper.min.js"></script>
    <title>热卖榜</title>
    <style>
        .swiper-slide{
            width:35% !important;
        }
      .icon{
          position: absolute;
          background: url(__STATIC__/img_user/rm-quanquan.png);
          top: 0;
          left: 0;
          background-size: 100% 100%;
          display: block;
          width: 24px;
          height: 24px;
          text-align: center;
          line-height: 24px;
          font-size: 14px;
          color: #E73F09;
      }

    </style>
</head>
<body>
<div class="wrap-hot-sale">
    <div class="header">
        <p>热卖榜</p>
        <img src="__STATIC__/img_user/back.png" class="back" onclick=window.location.href="{:url('mobile/user_port/index')}">
    </div>
    <div class="center">
        {volist name="terrace" id='v'}
        <div>
            <div class="title" onclick=window.location.href="{:url('mobile/user_action/get_more')}?id={$v.sonId}" >
                <span><a href="javascript:void(0);">{$v.title}</a></span>
                <img src="__STATIC__/img_user/next.png">
            </div>
            <div class="swiper-container">
                <ul class="swiper-wrapper">
                    {if condition="!empty($v.goods)"}
                    {volist  name="$v.goods" id='vv'}
                    <li class="swiper-slide">
                        <a href="javascript:jump_goods_details({$vv.id});">
                            <img src="/{$vv.thumb_img}" style="border-radius: 10%">
                            <span class="icon">{$key+1}</span>
                            <span>&yen;{$vv.price}</span>
                        </a>
                    </li>
                    {/volist}
                    {/if}
                </ul>
                <script>
                    $(function () {
                        var swiper = new Swiper('.swiper-container', {
                            slidesPerView: 2.6,
                            spaceBetween: 15,
//                            freeMode: true
                        });
                    })
                </script>
            </div>
        </div>
        {/volist}
        <div class="more">
            <p><a href="{:url('mobile/user_action/get_more')}"><span>更多 </span><img src="__STATIC__/img_user/next.png"></a></p>
        </div>

    </div>
</div>
<script>
    //跳转到商品详情
    function jump_goods_details(id){
        sessionStorage.setItem('goods_url_back',window.location.href);
        window.location.href = "{:url('mobile/user_category/goods_details')}?goods_id="+id;
    }
</script>
</body>
</html>